import React, { Component } from 'react';
import '../styles/Performer.scss'
import * as service from '../api/index'
import { NavBar, Button } from 'antd-mobile'
import { EditSOutline } from 'antd-mobile-icons'

class Performer extends Component {
    state = {
        performerlist: []
    }
    async componentDidMount() {
        let res = await service.mine_performer()
        // console.log(res.data.list);
        this.setState({ performerlist: res.data.list })
    }
    back = () => {
        this.props.history.goBack()
    }
    render() {
        return (
            <div className='performer'>
                <NavBar onBack={() => { this.back() }}>观演人</NavBar>
                <div className="performerlist">
                    {
                        this.state.performerlist.map((item, index) => {
                            return (
                                <div className="item">
                                    <div className="text">
                                        <div className="name">
                                            {item.name}
                                        </div>
                                        <div className="type_id">
                                            <div className="type">
                                                {item.type}：
                                            </div>
                                            <div className="id">
                                                {item.id}
                                            </div>
                                        </div>

                                    </div>
                                    <div className="emit">
                                        <EditSOutline fontSize={18} />
                                    </div>
                                </div>
                            )
                        })
                    }

                </div>
                <div className="create">
                    <Button block color='danger' size='large'>
                        新建观演人
                    </Button>
                </div>

            </div>
        );
    }
}

export default Performer; 